<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta charset="utf-8">
  <title><!--{$lang.page.index.title}--></title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="shortcut icon" href="/static/favicon.ico" type="image/x-icon" />
  <link rel="stylesheet" href="/static/lay/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="/static/lay/layui/index.css" media="all">
</head>
<body>

  <div class="layui-fluid">
    <div class="layui-card">
      <div class="layui-card-body" style="padding: 15px;">
        <form name="addItem" method="post" lay-filter="component-form-group" class="layui-form">
          <input type="hidden" value="<!--{$diInfo.id}-->" name="id">
            <div class="layui-form-item">
              <div class="layui-inline">
              <label class="layui-form-label"><!--{$lang.page.table.name}--></label>
              <div class="layui-input-inline">
               <input type="text" name="title" lay-verify="title" value="<!--{$diInfo.title}-->" placeholder="<!--{$lang.page.public.pinput}-->" autocomplete="off" class="layui-input" />
              </div>
              </div>
              
              <div class="layui-inline">
              <label class="layui-form-label"><!--{$lang.page.table.ident}--></label>
              <div class="layui-input-inline">
               <input type="text" name="acode" id='acode' lay-verify="acode" value="<!--{$diInfo.acode}-->" placeholder="<!--{$lang.page.public.pinput}-->" autocomplete="off" class="layui-input" />
              </div>
            </div>
          </div>

          <div class="layui-form-item showfk">
              <label class="layui-form-label"><!--{$lang.page.public.langinfo}--></label>
              <div class="layui-inline" id="submue"  style="width:80%;">
                <table class="layui-table" id="sharetable" lay-filter="table">
                <thead>
                    <tr>
                        <td width='15%'><!--{$lang.page.public.lang}--></td>
                        <td width='20%'><!--{$lang.page.public.title}--></td>
                        <td width='55%'><!--{$lang.page.public.blurb}--></td>
                        <td width='10%'><a class="layui-btn layui-btn-xs addshare"><!--{$lang.page.public.add}--></a></td>
                    </tr>
                </thead>
                <tbody>
                    <!--{if empty($diInfo.langinfo)}-->
                    <tr>
                      <td>
                        <select name="langs[]">
                          <option value=""><!--{$lang.page.public.select}--></option>
                          <!--{foreach from=$langs.list item=item }-->
                          <option value="<!--{$item.value}-->"><!--{$item.name}--></option>
                          <!--{/foreach}-->
                        </select>
                      </td>
                      <td><input type="text" name="titles[]" value="" class="layui-input" lay-verify="title"></td>
                      <td><textarea  name="introduction[]" placeholder="<!--{$lang.page.public.pinput}-->" class="layui-input" lay-verify="introduction"></textarea></td>
                      <td><a class="layui-btn layui-btn-danger layui-btn-xs delshare"><!--{$lang.page.public.del}--></a></td>
                    </tr>
                     <!--{else}-->
                     <!--{foreach from=$diInfo.langinfo item=item key=key}-->
                    <tr>
                      <td>
                        <select name="langs[]">
                          <option value=""><!--{$lang.page.public.select}--></option>
                          <!--{foreach from=$langs.list item=items}-->
                          <option value="<!--{$items.value}-->" <!--{if $key eq $items.value}-->selected<!--{/if}-->><!--{$items.name}--></option>
                          <!--{/foreach}-->
                        </select>
                      </td>
                      <td><input type="text" name="titles[]" value="<!--{$item.titles}-->" class="layui-input" lay-verify="title"></td>
                      <td><textarea name="introduction[]" placeholder="<!--{$lang.page.public.pinput}-->" class="layui-input" lay-verify="introduction"><!--{$item.introduction}--></textarea></td>
                      <td><a class="layui-btn layui-btn-danger layui-btn-xs delshare"><!--{$lang.page.public.del}--></a></td>
                    </tr>
                     <!--{/foreach}-->
                     <!--{/if}-->
                  </tbody>
                </table>
              </div>
            </div>
        
            <div class="layui-form-item" >
            <div class="layui-inline">
              <label class="layui-form-label"><!--{$lang.page.table.type}--></label>
              <div class="layui-input-block">
                <input type="radio" name="type" value="1" title="<!--{$lang.page.table.single}-->" lay-filter="type" <!--{if $diInfo.type eq 1}--> checked<!--{/if}-->>&nbsp;&nbsp;<input type="radio" name="type" value="2" title="<!--{$lang.page.table.list}-->" lay-filter="type" <!--{if $diInfo.type eq 2}--> checked<!--{/if}-->>
              </div>
            </div>
            <div class="layui-inline guisu" <!--{if $diInfo.type neq 1}-->style="display:none"<!--{/if}-->>
              <label class="layui-form-label"><!--{$lang.page.public.higher}--></label>
              <div class="layui-input-block">
                <select name="sid">
                  <option value=0><!--{$lang.page.public.select}--></option>
                  <!--{foreach item=item from=$sidinfo}-->
                  <option value="<!--{$item.id}-->" <!--{if $diInfo.sid eq $item.id }-->selected<!--{/if}-->><!--{$item.title}--></option>
                  <!--{/foreach}-->
                </select>
              </div>
            </div>
          </div>

          <div class="layui-form-item">

            <div class="layui-inline">
            <label class="layui-form-label"><!--{$lang.page.table.sort}--></label>
            <div class="layui-input-inline">
              <input type="text" name="orderid"  lay-verify="orderid"  value="<!--{$diInfo.orderid}-->" placeholder="<!--{$lang.page.public.pinput}-->" autocomplete="off" class="layui-input">
            </div>
          </div>

          <div class="layui-inline danye"  <!--{if $diInfo.type neq 1}-->style="display: none"<!--{/if}-->>
            <label class="layui-form-label"><!--{$lang.page.public.style}--> ID</label>
            <div class="layui-input-inline">
              <select name="dcssid">
                <option value=0><!--{$lang.page.public.select}--></option>
                <option value=1 <!--{if $diInfo.cssid eq 1}-->selected<!--{/if}-->><!--{$lang.page.public.style}--> 一</option>
                <option value=2 <!--{if $diInfo.cssid eq 2}-->selected<!--{/if}-->><!--{$lang.page.public.style}--> 二</option>
                <option value=3 <!--{if $diInfo.cssid eq 3}-->selected<!--{/if}-->><!--{$lang.page.public.style}--> 三</option>
                <option value=4 <!--{if $diInfo.cssid eq 4}-->selected<!--{/if}-->><!--{$lang.page.public.style}--> 四</option>
                <option value=5 <!--{if $diInfo.cssid eq 5}-->selected<!--{/if}-->><!--{$lang.page.public.style}--> 五</option>
              </select>
            </div>
          </div>

          <div class="layui-inline liebiao" <!--{if $diInfo.type neq 2}-->style="display: none"<!--{/if}-->>
            <label class="layui-form-label"><!--{$lang.page.public.style}--> ID</label>
            <div class="layui-input-inline">
              <select name="lcssid">
                <option value=0><!--{$lang.page.public.select}--></option>
                <option value=1 <!--{if $diInfo.cssid eq 1}-->selected<!--{/if}-->><!--{$lang.page.public.style}--> 一</option>
                <option value=2 <!--{if $diInfo.cssid eq 2}-->selected<!--{/if}-->><!--{$lang.page.public.style}--> 二</option>
                <option value=3 <!--{if $diInfo.cssid eq 3}-->selected<!--{/if}-->><!--{$lang.page.public.style}--> 三</option>
                <option value=4 <!--{if $diInfo.cssid eq 4}-->selected<!--{/if}-->><!--{$lang.page.public.style}--> 四</option>
                <option value=5 <!--{if $diInfo.cssid eq 5}-->selected<!--{/if}-->><!--{$lang.page.public.style}--> 五</option>
              </select>
            </div>
          </div>

          </div>

            <div class="layui-form-item">
              <label class="layui-form-label"><!--{$lang.page.table.addr}--></label>
              <div class="layui-input-inline" style="width:50%;">
                <input type="text" name="url" id="url" value="<!--{$diInfo.url}-->" lay-verify="url" placeholder="<!--{$lang.page.public.pinput}-->" autocomplete="off" class="layui-input" />
              </div>
            </div>

            <div class="layui-form-item">
              <label class="layui-form-label"><!--{$lang.page.public.vaddr}--></label>
              <div class="layui-input-inline" style="width:50%;">
                <input type="text" name="videourl" value="<!--{$diInfo.videourl}-->"  placeholder="<!--{$lang.page.public.pinput}-->" autocomplete="off" class="layui-input" />
              </div>
              <div class="layui-inline">
                <label class="layui-form-label"><!--{$lang.page.table.show}--></label>
                <div class="layui-input-block">
                  <input type="radio" name="is_video" value="1" title="<!--{$lang.page.table.no}-->" <!--{if $diInfo.is_video eq 1}--> checked<!--{/if}-->  >&nbsp;&nbsp;<input type="radio" name="is_video" value="2" title="<!--{$lang.page.table.yes}-->" <!--{if $diInfo.is_video eq 2}--> checked<!--{/if}-->>
                </div>
              </div>
            </div>
            <div class="layui-form-item">
                 <label class="layui-form-label"><!--{$lang.page.table.openpage}--></label>
                 <div class="layui-input-block">
                 <input type="radio" name="is_target" value="0" title="<!--{$lang.page.table.no}-->" <!--{if $diInfo.is_target eq 0}--> checked<!--{/if}-->  >&nbsp;&nbsp;<input type="radio" name="is_target" value="1" title="<!--{$lang.page.table.yes}-->" <!--{if $diInfo.is_target eq 1}--> checked<!--{/if}-->>
                </div>
            </div>

            <div class="layui-form-item">
              <label class="layui-form-label"><!--{$lang.page.table.img}--></label>
              <div class="layui-inline">
                <div class="layui-upload">
                  <div class="layui-upload-drag" id="upload">
                    <i class="layui-icon"></i>
                  </div>
                  
                  <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
                    <!--{$lang.page.public.smallimg}-->： <div class="layui-upload-list" id="images">
                      <!--{foreach item=item from=$diInfo.imgurls}-->
                      <img id="" src="<!--{$item}-->" onclick="xadmin.imgOpen({url:'<!--{$item}-->'});" style="width:100px; height: 50px"/>
                      <!--{/foreach}-->
                    </div>
                  </blockquote>
                  <p id="tipTxt"></p>
                </div>
                <input id="imgurl" name="imgurl" value="<!--{$diInfo.imgurl}-->" type="hidden" lay-verify="imgurl" />
              </div>
            </div>

            <div class="layui-form-item">
              <div class="layui-inline">
                <label class="layui-form-label"><!--{$lang.page.table.status}--></label>
                <div class="layui-input-block">
                  <input type="radio" name="status" value="0" title="<!--{$lang.page.table.close}-->" <!--{if $diInfo.status eq 0}--> checked<!--{/if}-->  >&nbsp;&nbsp;<input type="radio" name="status" value="1" title="<!--{$lang.page.table.normal}-->" <!--{if $diInfo.status eq 1}--> checked<!--{/if}-->>
                </div>
              </div>
              <div class="layui-inline">
                <label class="layui-form-label"><!--{$lang.page.table.inshow}--></label>
                <div class="layui-input-block">
                  <input type="radio" name="is_index" value="1" title="<!--{$lang.page.table.no}-->" <!--{if $diInfo.is_index eq 1}--> checked<!--{/if}-->  >&nbsp;&nbsp;<input type="radio" name="is_index" value="2" title="<!--{$lang.page.table.yes}-->" <!--{if $diInfo.is_index eq 2}--> checked<!--{/if}-->>
                </div>
              </div>
            </div>

          <div class="layui-form-item layui-layout-admin">
            <div>
              <div class="layui-footer" style="left: 0;">
                <button class="layui-btn" type="button" id="submit" lay-submit lay-filter="submit"><!--{$lang.page.public.submit}--></button>
                <button type="reset" class="layui-btn layui-btn-primary"><!--{$lang.page.public.reset}--></button>
                <button type="button" class="layui-btn layui-btn-primary" onClick="xadmin.close();" ><!--{$lang.page.table.back}--></button>
              </div>
            </div>
          </div>
        </form>
      </div>
    </div>
  </div>

</body>
</html>
  <script src="/static/lay/layui/layui.js"></script>
  <script type="text/javascript">
    var multiple_images = [];
    layui.config({
     base: '/static/lay/' //静态资源所在路径
   }).extend({
     xadmin: 'lib/xadmin' //弹窗
   }).use(['jquery', 'layer','xadmin', 'form', 'upload'], function(){
    var form = layui.form
        ,$ = layui.jquery
        ,upload = layui.upload;
     form.render(null, 'component-form-group');
     /* 自定义验证规则 */
    form.verify({

      title: function(value){
        if(value.length < 1){
          return '<!--{$lang.page.table.name}--> <!--{$lang.page.public.nocontent}-->';
        }
      }
      ,orderid: [/^[0-9]*$/, '<!--{$lang.page.table.sort}--> <!--{$lang.page.public.nocontent}-->']
      ,url: function(value){
        if(value.length < 1){
          return '<!--{$lang.page.table.addr}--> <!--{$lang.page.public.nocontent}-->';
        }
      }

    });

    
    //动态添加表单
    //因为动态添加的元素class属性是无效的，所以不能用
    $('body').on('click', '.addshare', function() {
      if ($('#sharetable tbody tr').length > <!--{$langs.total-1}-->) {
        layer.msg('<!--{$lang.page.public.moreset}--> <!--{$langs.total}--> <!--{$lang.page.public.strip}-->', {
            offset: '20px', 
            time : 2000
        });
      }else{
      //添加html
        var html = '<tr>'+
          '<td><select name="langs[]"><option value=""><!--{$lang.page.public.select}--></option>'+
          <!--{foreach from=$langs.list item=item}-->
          '<option value="<!--{$item.value}-->"><!--{$item.name}--></option>'+
          <!--{/foreach}-->
          '</select></td>'+
          '<td><input type="text" name="titles[]" value="" class="layui-input"></td>'+
          '<td><textarea  name="introduction[]" placeholder="<!--{$lang.page.public.pinput}-->" class="layui-input" ></textarea></td>'+
          '<td>'+'<a class="layui-btn layui-btn-danger layui-btn-xs delshare"><!--{$lang.page.public.del}--></a>'+
          '</td>'+
          '</tr>';
        //添加到表格最后
        $(html).appendTo($('#sharetable tbody:last'));
        form.render();
      }
    });
    $('body').on('click', '.delshare', function() {
      if ($('#sharetable tbody tr').length === 1) {
        layer.msg('<!--{$lang.page.public.onenodel}-->', {
            time : 2000
        });
      } else {
        //删除当前按钮所在的tr
        $(this).closest('tr').remove();
      }
    });

    form.on("radio(type)", function (data) {
        var acode = $("#acode").val();
        if (this.value == '1') { 
            $("#url").val('/home/web/single/?acode='+acode)
            $(".guisu").show()
            $(".danye").show()
            $(".liebiao").hide()
        } else if (this.value == '2') { 
            $("#url").val('/home/web/arcate/?acode='+acode)
            $(".guisu").hide()
            $(".danye").hide()
            $(".liebiao").show()
       } 
    })

    form.on('submit(submit)', function (data) {
          $('#submit').attr("disabled",true);
          $('#submit').addClass('layui-btn-disabled');
                $.post('#',data.field,function(res){
                    if(res.code == 200){
                        layer.msg(res.msg);
                        setTimeout(() => {
                          window.parent.location.reload();
                          xadmin.close();
                        }, 1000);
                    }else{
                        layer.msg(res.msg);
                    }
                })
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
    });
        //图片上传
        var uploadInst = upload.render({ 
          elem: '#upload' //绑定元素 
          ,url: '/admin/common/uploadimg/?folder=single' //上传接口
          ,accept:'images'
          ,exts:'jpg|jpeg|png|gjf|webp|bmp|tif'
          ,drag:false
          ,multiple: true 
          ,number: 6   
          ,auto:true  
          ,bindAction:'#hideUpload'       //绑定真正的上传按钮
          ,allDone: function(obj){
            var txt = "共选择了 【"+obj.total+"】 张图片，其中，上传成功 【"+obj.successful+"】 张，失败 <span style='color:red'>【"+obj.aborted+"】 </span>张";
            $("#tipTxt").html(txt);
          }
          ,before: function(obj){
              //预读本地文件示例，不支持ie8
              $('#images').html('');
              obj.preview(function(index, file, result){
                $('#images').append('<img src="'+ result +'" alt="'+ file.name +'" style="width:100px;height:50px">')
              });
          }
          ,done: function(res){
            multiple_images.push(res.data.src);
            // data=$('#imgurl').val();
            // data=data!=''?(data+','+res.data.src):res.data.src;
            $('#imgurl').attr('value', multiple_images);
            if (res.code == 200) {
              layer.msg('上传完毕', {icon: 1});
            }
          }
          ,error: function(){ 
           //请求异常回调 
          } 
        }); 


  });

  </script>